﻿define(['jquery','reg','api','AdministrativeDivisionOption'],function ($,reg,api,AdministrativeDivisionOption) {
    var CustomerEdit = {
        name: 'customer-edit',
        template: ''
        + '<div>'
        + '<Modal title="修改客户资料"'
        + '       v-model="showCustomerEdit"'
        + '       width="340"'
        + '       v-on:on-cancel="closeEdit"'
        //+ '       ok-text="保存修改"'
        //+ '       cancel- text="取消"'
        //+ '       loading="modal_loading"'
        //+ '       v-on:on-ok="saveCustomerEdit"'
        + '       class-name="changeLinkman vertical-center-modal">'
        + '    <div class="modal-content">'
        + '        <ul class="pri-ul clearfix">'
        + '            <li class="pri-li">'
        + '                <span class="model-left">客户姓名</span>'
        + '                <p class="model-right">'
        + '                    <Poptip content="客户姓名不能为空" placement="right" v-model="poptipName">'
        + '                        <input type="text" id="customer" name="search" placeholder="某先生" v-model="customerInfo.NameText"'
        + '                               v-on:input="showGenderOption" v-on:propertychange="showGenderOption" v-on:click.stop="validateName"/>'
        + '                    </Poptip>'
        + '                </p>'
        + '                <h3 class="c-shuru" v-show="showGender">'
        + '                    <em v-on:click="isMale">{{maleText}}</em>'
        + '                    <em v-on:click="isFemale">{{femaleText}}</em>'
        + '                </h3>'
        + '            </li>'
        + '            <li class="pri-li">'
        + '                <span class="model-left">客户属性</span>'
        + '                <p class="model-right edit-disable" >'
        + '                    <i>{{PoolType}}</i>'
        + '                </p>'
        + '            </li>'
        + '            <li class="pri-li">'
        + '                <span class="model-left">客户归属</span>'
        + '                <p class="model-right edit-disable">'
        + '                    <i>{{customerInfo.NodeName}}</i>'
        + '                </p>'
        + '            </li>'
        + '            <li class="pri-li pri-li-disabled">'
        + '                <span class="model-left">是否成交</span>'
        + '                <p class="model-right">'
        + '                    <span>{{customerInfo.HasTraded}}</span>'
        + '                    <i></i>'
        + '                </p>'
        + '            </li>'
        + '            <li class="pri-li">'
        + '                <span class="model-left">添加时间</span>'
        + '                <p class="model-right edit-disable" >'
        + '                    <i>{{customerInfo.AddTime}}</i>'
        + '                </p>'
        + '            </li>'
        + '            <li class="pri-li">'
        + '                <span class="model-left">省份城市</span>'
        + '                <p class="city model-right">'
        + '                    <Cascader v-bind:data="area" v-model="selectedArea" filterable></Cascader>'
        + '                </p>'
        + '                <Poptip content="必须选择客户所在城市" placement="right" v-model="poptipAreaCode">'
        + '                </Poptip>'
        + '            </li>'
        + '            <li class="pri-li">'
        + '                <span class="model-left">联系方式</span>'
        + '                <p class="model-right">'
        + '                    <Poptip content="客户联系方式不能为空" placement="right" v-model="poptipPhone">'
        + '                        <input type="text" v-model="customerInfo.Phone"  v-on:click.stop="validatePhone"/>'
        + '                    </Poptip>'
        + '                </p>'
        + '            </li>'
        + '            <li class="pri-li">'
        + '                <span class="model-left">客户来源</span>'
        + '                <p class="model-right">'
        + '                    <i-select  v-model="customerInfo.SourceType">'
        + '                        <i-option v-for="item in sourceTypeOption" v-bind:value="item" v-bind:key="item">'
        + '                            {{item}}'
        + '                        </i-option>'
        + '                    </i-select>'
        + '                </p>'
        + '                <Poptip content="必须选择客户来源类型" placement="right" v-model="poptipSourceType">'
        + '                </Poptip>'
        + '            </li>'
        + '            <li class="pri-li">'
        + '                <span class="model-left">来源终端</span>'
        + '                <p class="model-right">'
        + '                    <i-select  style="width:100%" v-model="customerInfo.SourceClient">'
        + '                        <i-option v-for="item in sourceClientOption" v-bind:value="item.EnumValue" v-bind:key="item.Desction">'
        + '                            {{item.Desction }}'
        + '                        </i-option>'
        + '                    </i-select>'
        + '                </p>'
        + '            </li>'
        + '            <li class="pri-li">'
        + '                <span class="model-left">意向房源</span>'
        + '                <p class="model-right">'
        + '                    <i-select  style="width:100%" v-model="customerInfo.IntentionHouse">'
        + '                        <i-option v-for="item in intentionHouseOption" v-bind:value="item.value" v-bind:key="item.text">'
        + '                            {{item.text }}'
        + '                        </i-option>'
        + '                    </i-select>'
        + '                </p>'
        + '            </li>'
        + '            <li class="pri-li-txta">'
        + '                <span class="model-left">初始需求</span>'
        + '                <p class="model-right">'
        + '                    <textarea name="" v-model="customerInfo.CustomerInitialDemand"></textarea>'
        + '                </p>'
        + '            </li>'
        + '            <li class=" pri-li-txta li-txta" style="float:left"><!--class=""-->'
        + '                <span class="model-left">客户备注</span>'
        + '                <p class="model-right">'
        + '                    <textarea name="" v-model="customerInfo.Remark" v-on:click.stop="validateRemark">'
        + '                    </textarea>'
        + '                </p>'
        + '                <Poptip content="客户备注不能为空" placement="right" v-model="poptipRemark">'
        + '                </Poptip>'
        + '            </li>'
        + '            <li class="pri-li">'
        + '                <span class="model-left">客户等级</span>'
        + '                <p class="model-right">'
        + '                    <i-select  style="width:100%" v-model="customerInfo.LevelId">'
        + '                        <i-option v-for="item in levelOption" v-bind:value="item.Id" v-bind:key="item.LevelName">'
        + '                            {{item.LevelName }}'
        + '                        </i-option>'
        + '                    </i-select>'
        + '                </p>'
        + '            </li>'
        + '        </ul>'
        + '    </div>'
        + '    <div slot="footer">'
        + '        <Button size="large" :loading="modal_loading" v-on:click.stop="saveCustomerEdit" class="ivu-btn-primary save-edit-cusotmer-bntton">'
        + '            保存修改'
        + '        </Button>'
        + '        <Button size="large"  v-on:click="closeEdit" class="ivu-btn-text">'
        + '            取消'
        + '        </Button>'
        + '    </div>'
        + '</Modal>'
        + '</div>',
        props: {
            poolType: String
        },
        data: function () {
            return {
                showCustomerEdit: false,
                modal_loading: false,
                customerInfo: {
                    Id:"",
                    Name: "",
                    NameText: "",
                    PoolType: "个人客户",
                    NodeName: "",
                    NodeId: "",
                    HasTraded: '否',
                    AddTime: "",
                    AdministrativeDivisionName: "",
                    AdministrativeDivisionCode: "",
                    Phone: "",
                    CustomerInitialDemand: "",
                    Remark: "",
                    IntentionHouse: "",
                    SourceClient: "",
                    SourceType: "",
                    LevelId: "",
                    LevelName: "",
                    Gender: 0,
                    GenderName: "",
                    SelectedArea: [],//所选的行政区域列表
                },
                PoolType: this.poolType === "StaffPool" ? "个人客户" : "公共客户",
                modalConfirm: false,
                confirmTitle: "确认客户",
                confirmContent: "确认内容",

                selectedArea: [],//所选的行政区域列表
                showGender: false,//是否显示性别选择框
                sourceClientOption: [],//客户来源终端选择项
                area: AdministrativeDivisionOption,//行政区域选择项
                sourceTypeOption: [],//客户来源类型选择项
                levelOption:[],//客户等级

                //验证
                poptipName: false,//客户客户姓名验证提示
                poptipPhone: false,
                poptipAreaCode: false,
                poptipRemark: false,
                poptipSourceType: false,
            }
        },
        computed: {
            femaleText: function () {
                return $.trim(this.customerInfo.NameText) + "女士";
            },
            maleText: function () {
                return $.trim(this.customerInfo.NameText) + "先生";
            },
            intentionHouseOption: function () {
                //#缺失部分#
                return [
                    { value: "f1", text: "房源1" },
                    { value: "f2", text: "房源2" },
                ];
            }
        },
        created: function () {
            var thisEdit = this;
            //ajax客户来源终端
            api.Get_Cusotmer_SourceClient()
                .done(function (data) {
                    if (data.IsSuccess) {
                        thisEdit.sourceClientOption = data.ResultObject;
                    } else {
                        thisEdit.$Message.error(data.ErrMsg);
                    }
                })
                .fail(function () {
                    thisEdit.$Message.error('查询出错');
                })
            api.Get_Customer_SourceType_Option()
                .done(function (data) {
                    if (data.IsSuccess) {
                        thisEdit.sourceTypeOption = data.ResultObject;
                    } else {
                        thisEdit.$Message.error(data.ErrMsg);
                    }
                })
                .fail(function () {
                    thisEdit.$Message.error('查询出错');
                })
            api.Get_All_Level()
                .done(function (data) {
                    if (data.IsSuccess) {
                        thisEdit.levelOption = data.ResultObject;
                    } else {
                        thisEdit.$Message.error(data.ErrMsg);
                    }
                })
                .fail(function () {
                    thisEdit.$Message.error('查询出错');
                })
        },
        mounted: function () {
            var thisEdit = this;
            //监听showCustomerEdit
            window.bus.$on("showCustomerEdit", function (Id) {
                thisEdit.getInfo(Id);
                thisEdit.showCustomerEdit = true;
                //触发deleteFocus
                window.bus.$emit("deleteFocus");
            });
        },
        watch: {
            selectedArea: function (newArea) {
                newArea.length === 0 ? this.customerInfo.AdministrativeDivisionCode = "" : this.customerInfo.AdministrativeDivisionCode = newArea[newArea.length - 1];
            }
        },
        methods: {
            closeEdit: function () {
                this.showCustomerEdit = false
                //触发addFocus
                window.bus.$emit("addFocus");
            },
            getInfo: function (Id) {
                var thisInfo = this;
                api.Get_Customer_Info({customerId: Id})
                    .done(function (data) {
                        if (data.IsSuccess) {
                            thisInfo.customerInfo = data.ResultObject;
                            thisInfo.selectedArea = thisInfo.customerInfo.SelectedArea;
                        } else {
                            thisInfo.$Message.error(data.ErrMsg);
                        }
                    })
                    .fail(function () {
                        thisInfo.$Message.error('查询出错');
                    })
            },
            showGenderOption: function () {
                if ($.trim(this.customerInfo.NameText) != "") {
                    this.showGender = true;
                }
            },
            isMale: function () {
                if ($.trim(this.customerInfo.NameText) != "") {
                    this.customerInfo.Gender = 0;
                    this.customerInfo.Name = $.trim(this.customerInfo.NameText);
                    this.customerInfo.NameText = this.maleText;
                }
                else {
                    this.customerInfo.Name = "";
                    this.customerInfo.NameText = "";
                }
                this.showGender = false;
            },
            isFemale: function () {
                if ($.trim(this.customerInfo.NameText) != "") {
                    this.customerInfo.Gender = 1;
                    this.customerInfo.Name = $.trim(this.customerInfo.NameText);
                    this.customerInfo.NameText = this.femaleText;
                }
                else {
                    this.customerInfo.Name = "";
                    this.customerInfo.NameText = "";
                }
                this.showGender = false;
            },
            validateAll: function () {
                var isFail = false;
                isFail = isFail || this.validateName();
                isFail = isFail || this.validateAreaCode();
                isFail = isFail || this.validatePhone();
                isFail = isFail || this.validateSourceType();
                isFail = isFail || this.validateRemark();
                return isFail;
            },
            validateName: function () {
                if ($.trim(this.customerInfo.NameText) != "") {
                    return this.poptipName = false;
                }
                else {
                    return this.poptipName = true;
                }
            },
            validatePhone: function () {
                if ($.trim(this.customerInfo.Phone) != "") {
                    return this.poptipPhone = false;
                }
                else {
                    return this.poptipPhone = true;
                }
            },
            validateAreaCode: function () {
                if ($.trim(this.customerInfo.AdministrativeDivisionCode) != "") {
                    return this.poptipAreaCode = false;
                }
                else {
                    return this.poptipAreaCode = true;
                }
            },
            validateSourceType: function () {
                if ($.trim(this.customerInfo.SourceType) != "") {
                    return this.poptipSourceType = false;
                }
                else {
                    return this.poptipSourceType = true;
                }
            },
            validateRemark: function () {
                if ($.trim(this.customerInfo.Remark) != "") {
                    return this.poptipRemark = false;
                }
                else {
                    return this.poptipRemark = true;
                }
            },
            saveCustomerEdit: function () {
                var thisEdit = this;
                if (thisEdit.validateAll()) {
                    return;
                } else {
                    thisEdit.saveCustomerPostRequest();
                }
            },
            saveCustomerPostRequest: function () {
                var thisEdit = this;
                thisEdit.modal_loading = true;
                api.Post_Edit_Customer(thisEdit.customerInfo)
                    .done(function (data) {
                        if (data.IsSuccess) {
                            thisEdit.$Message.success('保存成功');
                            thisEdit.modal_loading = false;
                            thisEdit.showCustomerEdit = false;
                            //触发saveCustomerEditSuccess
                            window.bus.$emit("saveCustomerEditSuccess", thisEdit.customerInfo.Id)
                        } else {
                            thisEdit.$Message.error(data.ErrMsg);
                            thisEdit.modal_loading = false;
                        }
                    })
                    .fail(function () {
                        thisEdit.$Message.error('保存失败');
                        thisEdit.modal_loading = false;
                    })
            },
        }
    };
    return  CustomerEdit;
});
